<template>
    <div class="share-card" @click="toDetail">
        <van-image fit="cover" :src="'/uploads'+data.shaier.photo">
          <template v-slot:error>
            <van-icon name="user-o" size="40" />
          </template>
        </van-image>
        <p>{{data.shaier.user_name}}</p>
        <p>{{data.update_time}}</p>
        <p>{{data.title==""?'这个人很懒，什么都没有说':data.title}}</p>
        <van-image fit="cover" :src="'/uploads'+data.thumb0">
          <template v-slot:error>
            <van-icon name="smile-o" size="80" />
          </template>
        </van-image>
    </div>
</template>

<script>
export default {
  name: 'ShareListCard',
  props: {
    data: Object
  },
  methods: {
    toDetail () {
      this.$root.$router.push({
        path: '/sharedetail',
        query: {
          data: this.data
        }
      })
    }
  }
}
</script>

<style scoped>
*{
    margin: 0;
    padding: 0;
}
.share-card{
    margin: 1rem;
    overflow: hidden;
    border-bottom: 1px solid #ddd;
}
.van-image:last-of-type{
    width: 100%;
    height: 15rem;
    border-radius: 10px;
    overflow: hidden;
}
.van-image:first-of-type{
    /* border: 1px solid black; */
    height: 3rem;
    width: 3rem;
    overflow: hidden;
    float: left;
    margin-bottom: 0.6rem;
    border-radius: 50%;
}
.share-card>p:first-of-type{
  width: 80%;
  float: left;
  margin-left: 0.5rem;
  font-size: 1.1rem;
}
.share-card>p:nth-of-type(2){
  float: left;
  margin-left: 0.5rem;
  margin-top: 0.5rem;
  font-size: 0.7rem;
  color: #333;
  width: 80%;
}
.share-card>p:nth-of-type(3){
  float: left;
  margin-left: 0.5rem;
  width: 90%;
  margin-bottom: 0.5rem;
}
</style>
